<?xml version="1.0" encoding="UTF-8" ?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	template="/WEB-INF/plantillas/default/tpl_default.xhtml">

	<ui:define name="title">::Cuentas::</ui:define>
	<ui:define name="cuerpo">
		<div class="panelTablaCuentas">
			<h:form id="#{cuentasController.idFormulario}" onLoad="reset()">
			
				<table border="0">
					<tr>
						<td width="5%" align="center"><p:graphicImage name="/img/modulos/cuentas.png" /></td>
						<td width="40%" align="left"><div class="textoSubTitulo ui-widget-header ui-corner-top ui-corner-bottom" align="center">Administracion de Cuentas</div></td>
						<td align="right">

						</td>
					</tr>
				</table>
				<br />
				<!--
					selection="#{cuentasController.cuentaSeleccionada}" lazy="true" selectionMode="single" rowKey="#{cuenta.id}" 
					-->
				<p:dataTable id="tablaCuentas" var="cuenta" value="#{cuentasController.lazyModelCuentaBean}" paginator="true" styleClass="tablaDatos"
					rows="20" paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
					rowsPerPageTemplate="10,20,30" lazy="true" dynamic="true">
				        <p:column sortBy="#{cuenta.idCuenta}" headerText="Id">
				            <h:outputText value="#{cuenta.idCuenta}" />
				        </p:column>
				
				        <p:column sortBy="#{cuenta.nombreCuenta}" headerText="Cuenta">
				            <h:outputText value="#{cuenta.nombreCuenta}" />
				        </p:column>
				
						<!--
						<p:column sortBy="#{cuenta.tipoCuenta.descripcionElemento}" headerText="Tipo">
				            <h:outputText value="#{cuenta.tipoCuenta.descripcionElemento}" />
				        </p:column>
				        -->
				        
				        <p:column headerText="Direccion">
				            <h:outputText value="#{cuenta.direccion}" />
				        </p:column>
				        
						<p:column headerText="E-mail">
				            <h:outputText value="#{cuenta.email}" />
				        </p:column>
				        
						<p:column headerText="Telefono">
				            <h:outputText value="#{cuenta.telefono}" />
				        </p:column>
				        
				        <p:column headerText="">
				            <p:commandLink ajax="true">
								<p:graphicImage name="/img/iconos/icono-editar.jpg" width="18" height="18" />
							</p:commandLink>
				        </p:column>
				        
				        <p:column headerText="">
				            <p:commandLink ajax="true">
								<p:graphicImage name="/img/iconos/icono-zoom.jpg" width="18" height="18" />
							</p:commandLink>
				        </p:column>
				        
				        <p:column headerText="">
				            <p:commandLink ajax="true">
								<p:graphicImage name="/img/iconos/icono-eliminar.png" width="18" height="18" />
							</p:commandLink>
				        </p:column>
				</p:dataTable>
				

			</h:form>
		</div>
	</ui:define>
</ui:composition>